import styles from "./index.module.less";
import NumCard from "./components/NumCard";
import TrendChart from "./components/TrendChart";
import Message from "./components/Message";
import HotMap from "./components/HotMap";
import CarSta from "./components/CarSta";
import { useRequest } from "ahooks";
import { getTaskByDate } from "@/api/modules/dashboard";

export default () => {
	const { data: data2 } = useRequest(() => getTaskByDate({}));
	const chartData = data2?.data;

	return (
		<div className={styles.flexContainer}>
			<div className={styles.up}>
				<div className={styles.upLeft}>
					<NumCard />
					<TrendChart chartData={chartData} />
				</div>
				<div className={styles.upRight}>
					<Message />
				</div>
			</div>
			<div className={styles.down}>
				<div className={styles.downLeft}>
					<HotMap chartData={chartData} />
				</div>
				<div className={styles.downRight}>
					<CarSta />
				</div>
			</div>
		</div>
	);
};
